import 'package:flutter/material.dart';
import 'package:flutter_inappwebview/flutter_inappwebview.dart';
 
// 定义一个 StatefulWidget，用于创建一个包含 WebView 的页面
class WebViewPage extends StatefulWidget {
  // 网页地址，必须传入
  final String url;
  // 页面标题，必须传入
  final String title;
  // 开始加载事件的回调函数，可选
  final Function? onLoadStart;
  // 加载完成事件的回调函数，可选
  final Function? onLoadStop;
  // 加载报错事件的回调函数，可选
  final Function? onLoadError;
 
  // 构造函数，传入网页地址、标题和可选的回调函数
  WebViewPage({
    required this.url,
    required this.title,
    this.onLoadStart,
    this.onLoadStop,
    this.onLoadError,
  });
 
  // 创建对应的 State 对象
  @override
  _WebViewPageState createState() => _WebViewPageState();
}
 
// 定义对应的 State 类
class _WebViewPageState extends State<WebViewPage> {
  // 声明一个 InAppWebViewController 对象，用于控制 WebView
  late InAppWebViewController _webViewController;
 
  @override
  Widget build(BuildContext context) {
    // 使用 Scaffold 构建页面结构
    return Scaffold(
      // 添加一个带有返回按钮的 AppBar
      appBar: AppBar(
        // 返回按钮
        leading: IconButton(
          icon: Icon(Icons.arrow_back), // 返回按钮图标
          onPressed: () {
            // 点击返回按钮时，返回上一个页面
            Navigator.pop(context);
          },
        ),
        // 标题显示传入的 title 参数
        title: Text(widget.title),
      ),
      // 在 body 中放置一个 InAppWebView
      body: InAppWebView(
        // 设置初始加载的 URL 请求
        initialUrlRequest: URLRequest(url: WebUri(widget.url)),
        // 当 WebView 创建完成后，获取控制器对象
        onWebViewCreated: (InAppWebViewController controller) {
          _webViewController = controller;
        },
        // 当网页开始加载时，触发回调
        onLoadStart: (controller, url) {
          // 如果 onLoadStart 回调函数不为空，则调用它
          if (widget.onLoadStart != null) {
            widget.onLoadStart!(url.toString());
          }
        },
        // 当网页加载完成时，触发回调
        onLoadStop: (controller, url) async {
          // 如果 onLoadStop 回调函数不为空，则调用它
          if (widget.onLoadStop != null) {
            widget.onLoadStop!(url.toString());
          }
        },
        // 当网页加载出错时，触发回调
        onReceivedError: (controller, request, error) {
          // 如果 onLoadError 回调函数不为空，则调用它
          if (widget.onLoadError != null) {
            // 传入请求的 URL、错误类型和错误描述
            widget.onLoadError!(request.url.toString(), error.type, error.description);
          }
        },
      ),
    );
  }
}